var margin = {top: 50, right: 50, bottom: 50, left: 50},
    width = 960 - margin.left - margin.right,
    height = 500 - margin.top - margin.bottom,
    padding = 5;

var maxValue = 889;
var radius = d3.scale.sqrt()
    .domain([0, maxValue])
    .range([0, 70]);

var x = d3.scale.linear()
    .domain([0, 1])
    .range([0, width]);

var y = d3.scale.linear()
    .domain([0, 1])
    .range([0, height]);
	
var choosefont = d3.scale.linear()
     .domain([0, Math.sqrt(maxValue/Math.PI)])
	 .range(["8px", "26px"]);
	
var force = d3.layout.force()
    .charge(0)
    .gravity(0)
    .size([width, height]);

var svg = d3.select("#chart").append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
  .append("g")
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

// axis
// horizontal
svg.append("svg:line")
    .attr("x1", x(0))
    .attr("y1", y(0))
    .attr("x2", x(1))
    .attr("y2", y(0))
    .attr("class", "axis")

// xlabel	
svg.selectAll(".xLabel")
    .data(x.ticks(10))
    .enter().append("svg:text")
    .attr("class", "xLabel")
    .text(String)
    .attr("x", function(d) { return x(d) })
    .attr("y", height + margin.top + margin.bottom - 50)
    .attr("text-anchor", "middle");

var laused;
d3.csv("top50_loc_org_laused.csv", function(error, data) {
	laused = data;
});
	
var nodes;
d3.csv("top50_loc_org.csv", function(error, entities) {
  nodes = entities
      .map(function(d) {
        var point = x(d.ORG/d.loc_org),
            value = d.loc_org,
			y_value = y(Math.random()),
			olem = d.olem;
        return {
          x: point, y: y_value,
          x0: point, y0: y_value,
          r: radius(value),
          value: value,
		  olem: olem,
		  ORG: d.ORG,
		  LOC: d.LOC
        };
      });

  force
      .nodes(nodes)
      .on("tick", tick)
      .start();


  var node = svg.selectAll(".node")
      .data(nodes)
    .enter().append("g")
	  .attr("class", "node")
	  .on("mouseover", mouseover)
      .on("mouseout", mouseout)
	  .on("click", click)
	  .call(force.drag);	  

  node.append("circle")
	  .attr("r", function(d) { return d.r; })
	  .attr("class", "circ");
	  
  node.append("text")
		.attr("text-anchor", "middle")
		.text(function(d) { return d.olem})
		.style("font-size", function(d){ return choosefont(Math.sqrt(d.value/Math.PI))})
		.style("fill", "black");
		
  node.append("text")
		.attr("text-anchor", "middle")
		//.attr("dx", 0)
		.attr("dy", "1em")
		.text(function(d) { return d.LOC + " - " + d.ORG})
		.style("font-size", function(d){ return choosefont(Math.sqrt(d.value/Math.PI))/2})
		.style("fill", "dimgray");
	
  function mouseover(d) {
    d3.select(this).select(".circ").classed("circ-hover", true);
  }
  function mouseout(d) {
    d3.select(this).select(".circ").classed("circ-hover", false);
  }
  function click(d) {
	console.log(d);
	console.log(this);
	d3.select(".g-left").selectAll("div").remove()
	d3.select(".g-right").selectAll("div").remove()
    var loc = d3.select(".g-left").append("div");
	var org = d3.select(".g-right").append("div");
	console.log(loc);
	var sub_loc = laused.filter(function(dd) {return (dd.olem === d.olem & dd.NER==="LOC"); });
	var sub_org = laused.filter(function(dd) {return (dd.olem === d.olem & dd.NER==="ORG"); });
	//console.log(sub);
	loc.selectAll("p")
		.data(sub_loc)
		.enter()
		.append("p")
			.html(function(da) {return da.lause; });
	org.selectAll("p")
		.data(sub_org)
		.enter()
		.append("p")
			.html(function(da) {return da.lause; });

  }


  function tick(e) {
    node.each(gravity(e.alpha * .1))
        .each(collide(.5))
		.attr("transform", function(d) { return "translate(" + (d.x) + "," + (d.y) + ")"; });
  }

  function gravity(k) {
    return function(d) {
      d.x += (d.x0 - d.x) * k;
      d.y += (d.y0 - d.y) * k;
    };
  }

  function collide(k) {
    var q = d3.geom.quadtree(nodes);
    return function(node) {
      var nr = node.r + padding,
          nx1 = node.x - nr,
          nx2 = node.x + nr,
          ny1 = node.y - nr,
          ny2 = node.y + nr;
      q.visit(function(quad, x1, y1, x2, y2) {
        if (quad.point && (quad.point !== node)) {
          var x = node.x - quad.point.x,
              y = node.y - quad.point.y,
              l = x * x + y * y,
              r = nr + quad.point.r;
          if (l < r * r) {
            l = ((l = Math.sqrt(l)) - r) / l * k;
            node.x -= x *= l;
            node.y -= y *= l;
            quad.point.x += x;
            quad.point.y += y;
          }
        }
        return x1 > nx2 || x2 < nx1 || y1 > ny2 || y2 < ny1;
      });
    };
  }
});
